<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>内容查找与替换</title>
    <style>
      div{float:left;}
      input{margin:0 20px;}
    </style>
  </head>
  <body>
    <h2>内容查找与替换</h2>
    <div>过滤前内容:<br>
      <textarea id="pre" rows="10" cols="40"></textarea>
      <input id="btn" type="button" value="过滤">
    </div>
    <div>过滤后内容:<br>
      <textarea id="res" rows="10" cols="40"></textarea>
    </div>
    <script>
      document.getElementById('btn').onclick = function () {
        // 定义查找并需要替换的内容规则，[\u4e00-\u9fa5]表示匹配任意中文字符
        var reg = /(bad)|[\u4e00-\u9fa5]/gi;
        var str = document.getElementById('pre').value;
        var newstr = str.replace(reg, '*');
        document.getElementById('res').innerHTML = newstr;
      };
    </script>
     <p><a href="default.html">返回目录</a></p>
     <p><a href="第九章.html">返回第九章</a></p>
     <p><a href="表单验证.html">下一题</a></p>
     <p><a href="第十章.html">下一章</a></p>
  </body>
</html>